<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../css/home/classify.css" />
		<style>
			html,
			body,
			.mui-content {
				background: #fff;
			}
		</style>
	</head>

	<body>
		<div id="clsaddcart" v-cloak>
			<div class="collection">
				<div class="collection_head">
					<div class="collection_img"><img src="../../images/noimg.jpg" v-lazy="imgCommonUrl+ shopData.pic" /></div>
					<div class="collection_introduce">
						<div class="collection_title">{{shopData.name}}</div>
						<div class="collection_money" v-show="shopData.cash">{{'￥' + shopData.cash}}</div>
					</div>
					<div class="collection_close mui-action-back"><img src="../../images/close.png" /></div>
				</div>
				<div class="collection_data">
					<div class="collection_info">
						<div>
							<div>规格</div>
						</div>
						<div>
							<div>单价</div>
						</div>
						<div>
							<div>数量</div>
						</div>
					</div>
					<div class="collection_info" v-for="skuDtoList in shopData.skuDtoList">
						<div>{{skuDtoList.cn_properties}}</div>
						<div class="money">
							<div><span>￥</span>{{skuDtoList.cash}}</div>
						</div>
						<div class="collection_num">
							<button type="button" class="mui-btn" @tap="reduceShop(skuDtoList)">-</button>
							<input type="tel" v-model="skuDtoList.num" @input="inputNum(skuDtoList)" />
							<button type="button" class="mui-btn" @tap="addShop(skuDtoList)">+</button>
						</div>
					</div>

				</div>

			</div>
			<div class="add_button">
				<button type="button" class="mui-btn" @tap="addShopBuy">确定加入</button>
				<button type="button" class="mui-btn mui-btn-danger" @tap="goConfirm">确定购买</button>
			</div>
		</div>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/libs/zepto.js"></script>
		<script src="../../js/libs/vue.js"></script>
		<script src="../../js/libs/vue-lazyload.js"></script>
		<script src="../../js/common.js"></script>
		<script type="text/javascript">
			mui.init()
			mui.plusReady(function() {
				if(common.data && common.data.token) {
					var auth = {
						auth: "YL " + common.data.token
					}
				}
				//请求后台tokan过期问题
				mui.ajax(common.urls + '/p/userhome', {
					data: {},
					dataType: 'json', //服务器返回json格式数据
					type: 'get', //HTTP请求类型
					timeout: 10000, //超时时间设置为10秒；
					headers: auth,
					success: function(data) {
						console.log(data)
						if(data.code == '-10') {
							localStorage.removeItem('userData')
						}
					}
				});

				var self = plus.webview.currentWebview();

				if(plus.device.model == 'iPhoneX') {
					self.setStyle({
						bottom: "34px"
					})
				}

				//			var self;
				//							self.preload = 5046
				//			self.preload = 5943
				var close = mui.back
				mui.back = function() {
					backclose()
					plus.webview.currentWebview().close()
				}
				Vue.use(VueLazyload, {
					preLoad: 1.3,
					error: '../../images/noimg.jpg',
					loading: '../../images/noimg.jpg'
				});
				var classify = new Vue({
					el: '#clsaddcart',
					data: {
						imgCommonUrl: common.imageUrl,
						shopData: '',
					},
					methods: {
						addShop: function(data) {
							if(data.num < data.stocks) {
								data.num++
							} else {
								data.num = data.stocks
								common.toast("库存不足")
							}
						},
						inputNum: function(data) {
							data.num = data.num.replace(/[^0-9]/g, '')
							if(data.num > data.stocks) {
								data.num = data.stocks
								common.toast("库存不足")
							} else if(data.num <= 0 && data.num != '') {
								data.num = 0
							}
						},

						reduceShop: function(data) {
							if(data.num > 0) {
								data.num--
							}
						},
						addShopBuy: function() {

							var temp = ''
							for(var i = 0; i < classify.shopData.skuDtoList.length; i++) {
								if(classify.shopData.skuDtoList[i].num > 0) {
									temp += classify.shopData.skuDtoList[i].skuId + ':' + classify.shopData.skuDtoList[i].num + ','
								}
							}

							if(temp == '') {
								common.toast('请选择商品')
								return
							}
							if(!JSON.parse(localStorage.getItem('userData'))) {

								//商店信息
								common.ajax('/shopCart/getShopByProId', {
									proIds: classify.shopData.prodId
								}, function(data) {
									if(data.code == 1) {

										local(data.data.list[0])
									} else {
										if(data.resultMsg) {
											mui.toast(data.resultMsg)
										}
									}
								}, true, 'get')
							} else {
								common.ajax('/shopCart/addShopBuy', {
									prodId: self.preload,
									skuId: temp.substring(0, temp.length - 1)
								}, function(data) {
									if(data.code == 1) {
										for(var i = 0; i < classify.shopData.skuDtoList.length; i++) {
											classify.shopData.skuDtoList[i].num = 0
										}
										common.toast('添加成功')
										backclose()

										var shopping = plus.webview.getWebviewById("shopping.html")
										mui.fire(shopping, 'refreshs');
									} else {
										if(data.resultMsg) {
											mui.toast(data.resultMsg)
										}
									}
								})
							}

						},
						//立即购买
						goConfirm: function() {
							if(!JSON.parse(localStorage.getItem('userData'))) {
								common.open('../login/login.html', '../login/login.html')
								backclose()
								return
							}

							var temp = ''
							for(var i = 0; i < classify.shopData.skuDtoList.length; i++) {
								if(classify.shopData.skuDtoList[i].num > 0) {
									temp += classify.shopData.skuDtoList[i].skuId + ':' + classify.shopData.skuDtoList[i].num + ','
								}
							}

							if(temp == '') {
								common.toast('请选择商品')
								return
							}
							var data = {
								prodId: self.preload,
								skuIds: temp.substring(0, temp.length - 1)
							}
							common.open('../order/confirmorder.html', '../order/confirmorder.html', {
								swith: true,
								data: data
							})

							backclose()

						}
					},
					mounted: function() {
						common.ajax('/category/classifyProDetail/' + self.preload, {}, function(data) {
							if(data.code == 1) {
								for(var i = 0; i < data.data.prod.skuDtoList.length; i++) {
									data.data.prod.skuDtoList[i].num = 0
								}
								classify.shopData = data.data.prod
							} else {
								if(data.resultMsg) {
									mui.toast(data.resultMsg)
								}
							}
						}, false, 'get')
					}
				})

				function local(getShopName) {
					//店铺信息
					getShopName.shopName = getShopName.name
					getShopName.checkSts = 1
					getShopName.edit = 0
					getShopName.local = true
					//商品信息
					getShopName.cartItems = []
					var shopData = classify.shopData
					shopData.prodName = shopData.name
					shopData.local = true
					shopData.checkSts = 1
					shopData.edit = 0

					//规格
					var shopSpec = []
					for(var i = 0; i < shopData.skuDtoList.length; i++) {
						if(shopData.skuDtoList[i].num > 0) {
							shopData.skuDtoList[i].basketCount = shopData.skuDtoList[i].num
							shopData.skuDtoList[i].basketId = shopData.skuDtoList[i].skuId
							shopData.skuDtoList[i].promotionPrice = ''
							shopData.skuDtoList[i].checkSts = 1
							shopData.skuDtoList[i].edit = 0
							shopData.skuDtoList[i].local = true
							shopData.skuDtoList[i].cnProperties = shopData.skuDtoList[i].cn_properties
							shopSpec.push(shopData.skuDtoList[i])
						}
					}

					shopData.shopSpec = shopSpec
					getShopName.cartItems.push(shopData)
					var list = JSON.parse(localStorage.getItem('shopPingCar')) || []
					if(list.length <= 0) {
						list.push(getShopName)
					} else {
						var check = 0
						for(var i = 0; i < list.length; i++) {
							//判断店铺有没有相同，不同就push
							if(list[i].shopId == getShopName.shopId) {
								for(var j = 0; j < list[i].cartItems.length; j++) {
									//判断是否同一个商品，不同就添加在同店铺
									if(list[i].cartItems[j].skuId == classify.shopData.skuId) {
										for(var c = 0; c < list[i].cartItems[j].shopSpec.length; c++) {
											for(var a = 0; a < shopSpec.length; a++) {
												//判断同不同规格,同规格就加数量,否则就添加一个规格
												if(shopSpec[a].basketId == list[i].cartItems[j].shopSpec[c].basketId) {
													console.log(list[i].cartItems[j].shopSpec[c].basketCount)
													console.log(shopSpec[a].num)

													list[i].cartItems[j].shopSpec[c].basketCount = Number(list[i].cartItems[j].shopSpec[c].basketCount) + Number(shopSpec[a].num)

												} else {
													var basketId = '"basketId":' + shopSpec[a].basketId
													if(JSON.stringify(list).indexOf(basketId) < 0) {
														list[i].cartItems[j].shopSpec.push(shopSpec[a])
														shopSpec[a].num = 0
													}
												}
											}
										}
									} else {
										var skuId = '"skuId":' + classify.shopData.skuId
										if(JSON.stringify(list).indexOf(skuId) < 0) {
											list[i].cartItems.push(shopData)
											break
										}
									}
								}
							} else {
								var proId = '"shopId":' + getShopName.shopId
								if(JSON.stringify(list).indexOf(proId) < 0) {
									list.push(getShopName)
									break
								}
							}
						}
					}

					if(shopSpec.length > 0) {
						localStorage.setItem('shopPingCar', JSON.stringify(list))
						common.toast('添加成功')
						backclose()

						var shopping = plus.webview.getWebviewById("shopping.html")
						mui.fire(shopping, 'refreshs');
						for(var i = 0; i < shopData.skuDtoList.length; i++) {
							shopData.skuDtoList[i].num = 0
						}
					}
				}
				var setheight = ''
				if(mui.os.ios) {
					$(document).on('focus', 'input', function() {
						plus.webview.currentWebview().setStyle({
							top: '0',
							bottom: '40%'
						})
						setHe()
					})
					$(document).on('blur', 'input', function() {

						if(plus.device.model == 'iPhoneX') {
							plus.webview.currentWebview().setStyle({
								top: '40%',
								bottom: '34px'
							})
						} else {
							plus.webview.currentWebview().setStyle({
								top: '40%',
								bottom: '0'
							})
						}

						clearTimeout(setheight)
					})
				} else {
					var originalHeight = document.documentElement.clientHeight || document.body.clientHeight;
					window.onresize = function() {
						//软键盘弹起与隐藏  都会引起窗口的高度发生变化
						var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;

						if(resizeHeight * 1 < originalHeight * 1) { //resizeHeight<originalHeight证明窗口被挤压了
							plus.webview.currentWebview().setStyle({
								top: '10px',
								bottom: '0'
							})
						} else {
							plus.webview.currentWebview().setStyle({
								top: '40%',
								bottom: '0'
							})
						}
					}
				}

				function setHe() {
					document.body.scrollTop = document.body.scrollHeight
					setheight = setTimeout(setHe, 100)
				}

				function backclose() {
					close()
					var list = plus.webview.getWebviewById("classify.html")
					mui.fire(list, 'hideMask');
					var seach = plus.webview.getWebviewById("../seach/seach.html")
					mui.fire(seach, 'hideMask');
					var shopSeach = plus.webview.getWebviewById("../seach/shopSeach.html")
					mui.fire(shopSeach, 'hideMask');
					var shopping = plus.webview.getWebviewById("shopping.html")
					mui.fire(shopping, 'hideMask');
				}
			})
		</script>
	</body>

</html>